<template>
  <div>
    <Goback :title="title"></Goback>
    <div class="ten">昨天 20：00</div>
    <div class="kefu">
      <div class="img">
        <img
          src="../../img/兼职王logo6 拷贝 4.png"
          style="width: 100%"
          alt=""
        />
      </div>
      <p class="pp1">
        <b
          >很高兴遇见您，有相关疑问，请先提供订单号或者物流单号，并
          且描述一下问题梗概哦，这样方便小客服给您快速处理问题呢～</b
        >
      </p>
    </div>
    <div class="kefu">
      <div class="images">
        <img src="../../img/爱心_看图王.png" style="width: 100%" alt="" />
      </div>
      <p class="pp2">
        <b
          >很高兴遇见您，有相关疑问，请先提供订单号或者物流单号，并
          且描述一下问题梗概哦，这样方便小客服给您快速处理问题呢～</b
        >
      </p>
    </div>
    <div class="fool">
      <div class="image">
        <img
          src="https://lanhu.oss-cn-beijing.aliyuncs.com/ps21vtw76eu1b7gwadb8puisujj5ztbouecae5b446-ddaa-416b-8c92-9851a5c370b3"
          alt=""
          style="width: 100%"
        />
      </div>
      <p class="pp3">按住说话</p>
      <div class="jia">+</div>
    </div>
  </div>
</template>

<script>
import Goback from "@/components/index/Goback";
export default {
  data() {
    return {
      title: "",
    };
  },
  mounted() {
    this.title = this.$route.meta.title;
  },
  components: {
    Goback,
  },
};
</script>

<style lang="scss">
.fool {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 98px;
}
.image {
  width: 54px;
  height: 54px;
  margin-top: 24px;
  margin-left: 30px;
  float: left;
}
.pp3 {
  width: 540px;
  height: 78px;
  text-align: center;
  line-height: 78px;
  float: left;
  margin-top: 10px;
  background: #ffffff;
  border: 1px solid #cacaca;
  border-radius: 39px;
  margin-left: 21px;
}
.jia {
  float: right;
  width: 54px;
  height: 54px;
  text-align: center;
  line-height: 54px;
  font-size: 48px;
  font-family: PingFang SC;
  font-weight: 400;
  color: #ffffff;
  background: #fbc805;
  border-radius: 50%;
  margin-right: 30px;
  margin-top: 24px;
}
.kefu {
  width: 100%;
  height: 200px;
  margin-top: 26px;
}
.ten {
  width: 168px;
  height: 46px;
  background-color: #d0d3d9;
  color: #fff;
  text-align: center;
  line-height: 46px;
  border-radius: 20px;
  margin: 20px auto;
}
.img {
  width: 78px;
  height: 78px;
  float: left;
  margin-left: 26px;
  margin-top: 26px;
  border-radius: 50%;
  overflow: hidden;
}
.pp1 {
  width: 512px;
  height: 195px;
  float: left;
  border-radius: 20px;
  border: 1px solid #cacaca;
  margin-left: 10px;
}
.pp1 b {
  display: block;
  width: 418px;
  height: 137px;
  margin: 29px auto;
}
.images {
  width: 78px;
  height: 78px;
  float: right;
  margin-right: 26px;
  margin-top: 26px;
  border-radius: 50%;
  overflow: hidden;
}
.pp2 {
  width: 512px;
  height: 195px;
  float: right;
  border-radius: 20px;
  border: 1px solid #cacaca;
  margin-right: 10px;
}
.pp2 b {
  display: block;
  width: 418px;
  height: 137px;
  margin: 29px auto;
}
</style>
